<template>
    <div>
        <h1>Home</h1>
        <div style="display: flex;">
            <ul>
                <li><router-link to="/home/home1">Home1</router-link></li>
                <li><router-link to="/home/home2">Home2</router-link></li>
                <li><router-link to="/home/home3">Home3</router-link></li>
            </ul>
            <div>
                <RouterView />
            </div>
        </div>
    </div>
</template>

<script>
import { RouterView } from 'vue-router';

    
    // 在main.js中，我们注册了路由，并配置了路由规则
    // RouterView 是 Vue 提供的一个组件，用于显示路由对应的组件
    // 在 RouterView 中，我们可以使用 router-link 来定义路由链接
    // 子路由
    // 动态路由
</script>
